<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!-- head部分 -->
<head th:fragment="head(title)">
    <meta charset="UTF-8">
    <title th:text="${title}"></title>
    <link th:href="@{https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css}" rel="stylesheet" />

    <style>
        body{
            padding-top: 50px;
            padding-bottom: 20px;
        }
    </style>
</head>
<body>

<!-- 顶部导航菜单 -->
<div class="navbar navbar-inverse navbar-fixed-top" th:fragment="header">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a th:href="@{/}">首页</a></li>
                <li><a th:href="@{/product}">产品信息</a></li>
                <li><a th:href="@{/user}">用户管理</a></li>
            </ul>

            <!--根据登录状态显示下面两项中的一个-->
            <ul class="nav navbar-nav navbar-right" th:if="!${session.status}">
                <li><a th:href="@{/login}">登录</a></li>
            </ul>

            <ul class="nav navbar-nav navbar-right" th:if="${session.status}">
                <li><a th:href="@{/myinfo}" th:text="${'你好'+ session.loginUser.getName()}">你好</a></li>
                <li><a th:href="@{/logout}">安全退出</a></li>
            </ul>

        </div>
    </div>
</div>


<!-- 底部页脚部分 -->
<div th:fragment="footer">
    <hr>
    <p class="text-center">
        2021 &copy; by wustzz
    </p>
</div>

<!-- 底部js部分 -->
<div th:fragment="scripts">
    <script th:src="@{https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js}"></script>
    <script th:src="@{https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js}"></script>
</div>

</body>
</html>